<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <title>乐购产品sku管理</title>
    <meta name="decorator" content="default"/>
    <script type="text/javascript">
        $(document).ready(function () {
            //$("#name").focus();
            $("#inputForm").validate({
                submitHandler: function (form) {
                    loading('正在提交，请稍等...');
                    form.submit();
                },
                errorContainer: "#messageBox",
                errorPlacement: function (error, element) {
                    $("#messageBox").text("输入有误，请先更正。");
                    if (element.is(":checkbox") || element.is(":radio") || element.parent().is(".input-append")) {
                        error.appendTo(element.parent().parent());
                    } else {
                        error.insertAfter(element);
                    }
                }
            });
        });
    </script>
</head>
<body>
<ul class="nav nav-tabs">
    <li><a href="${ctx}/shop/product/hkShopProductSku/list?product.id=${hkShopProductSku.product.id}">乐购产品sku列表</a></li>
</ul>
<br/>
<sys:message content="${message}"/>
<form:form id="inputForm" modelAttribute="hkShopProductSku" action="${ctx}/shop/product/hkShopProductSku/save"
           method="post" class="form-horizontal">
    <div class="control-group">
        <div class="controls" style="margin-left: 0px">
            <table id="contentTable" class="table table-striped table-bordered table-condensed">
                <thead>
                <tr>
                    <th class="hide"></th>
                    <th>颜色</th>
                    <th>规格</th>
                    <th>库存</th>
                    <th>重量</th>
                        <%--<th>市场价</th>
                        <th>进货价</th>--%>
                    <th>价格</th>
                        <%--<th>乐币</th>--%>
                    <th>序号</th>
                    <th>备注</th>
                </tr>
                </thead>
                <tbody id="skusList">
                </tbody>
                </tfoot>
            </table>
            <script type="text/template" id="skusTpl">//<!--
						<tr id="skusList{{idx}}">
							<td class="hide">
								<input id="skus{{idx}}_id" name="skusList[{{idx}}].id" type="hidden" value="{{row.id}}"/>
								<input id="skus{{idx}}_product_id" name="skusList[{{idx}}].product.id" type="hidden" value="{{row.product.id}}"/>
								<input id="skus{{idx}}_delFlag" name="skusList[{{idx}}].delFlag" type="hidden" value="0"/>
							</td>
							<td>
								<input id="skus{{idx}}_productColor_name" readonly name="skusList[{{idx}}].productColor.name" type="text" value="{{row.productColor.name}}"   class="input-mini "/>
							</td>
							<td>
								<input id="skus{{idx}}_productSpec_name" readonly name="skusList[{{idx}}].productSpec.name" type="text" value="{{row.productSpec.name}}"   class="input-mini "/>
							</td>
							<td>
								<input id="skus{{idx}}_stocks" name="skusList[{{idx}}].stocks" type="text" value="{{row.stocks}}"   class="input-mini input-xlarge  digits  required"/>
							</td>
							<td>
								<input id="skus{{idx}}_weight" name="skusList[{{idx}}].weight" type="text" value="{{row.weight}}"   class="input-mini "/>
							</td>
							<%--<td>
								<input id="skus{{idx}}_marketPrice" name="skusList[{{idx}}].marketPrice" type="text" value="{{row.marketPrice}}"   class="input-mini "/>
							</td>
							<td>
								<input id="skus{{idx}}_costprice" name="skusList[{{idx}}].costprice" type="text" value="{{row.costprice}}"   class="input-mini "/>
							</td>--%>
							<%--<td>
								<input id="skus{{idx}}_price" name="skusList[{{idx}}].price" type="text" value="{{row.price}}"   class="input-mini "/>
							</td>--%>
							<td>
								<input id="skus{{idx}}_integral" name="skusList[{{idx}}].integral" type="text" value="{{row.integral}}"  class="input-mini input-xlarge  digits  required"/>
							</td>

							<td>
								<input id="skus{{idx}}_number" name="skusList[{{idx}}].number" type="text" value="{{row.number}}"   class="input-mini input-xlarge  digits  required"/>
							</td>
                            <td>
								<input id="skus{{idx}}_remarks" name="skusList[{{idx}}].remarks" type="text" value="{{row.remarks}}"   class="input-mini "/>
							</td>

						</tr>//-->
            </script>
            <script type="text/javascript">
                var skusRowIdx = 0, skusTpl = $("#skusTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g, "");
                $(document).ready(function () {
                    var data = ${fns:toJson(skusList)};
                    for (var i = 0; i < data.length; i++) {
                        addRow('#skusList', skusRowIdx, skusTpl, data[i]);
                        skusRowIdx = skusRowIdx + 1;
                    }
                });
            </script>
        </div>
    </div>
    <div class="form-actions">
        <shiro:hasPermission name="shop:product:hkShopProductSku:edit"><input id="btnSubmit" class="btn btn-primary"
                                                                              type="submit"
                                                                              value="保 存"/>&nbsp;</shiro:hasPermission>
        <a class="btn  " href="${ctx}/shop/product/hkShopProduct/">返回</a>

    </div>
</form:form>
<script type="text/javascript">

    function addRow(list, idx, tpl, row) {
        $(list).append(Mustache.render(tpl, {
            idx: idx, delBtn: true, row: row
        }));
        $(list + idx).find("select").each(function () {
            $(this).val($(this).attr("data-value"));
        });
        $(list + idx).find("input[type='checkbox'], input[type='radio']").each(function () {
            var ss = $(this).attr("data-value").split(',');
            for (var i = 0; i < ss.length; i++) {
                if ($(this).val() == ss[i]) {
                    $(this).attr("checked", "checked");
                }
            }
        });
    }

</script>
</body>
</html>